<template>
    <div>
        <ul>
            <li @click="goCategorya">
                <van-icon name="fire" color="red" size="40px" />
                <p>漫展</p>
            </li>
            <li @click="goCategoryb">
                <van-icon name="gem" color="#01cb88" size="40px" />
                <p>周边</p>
            </li>
            <li @click="goCategoryc">
                <van-icon name="video" color="#ffb62d" size="40px" />
                <p>电影</p>
            </li>
        </ul>
    </div>
</template>

<script setup>
import { useRouter } from 'vue-router'
const router = useRouter() 

// 漫展
const goCategorya=()=> {
    router.push('/manzhan')
}
// 周边
const goCategoryb=()=> {
    router.push('/zhoubian')
}
// 电影
const goCategoryc=()=> {
    router.push('/dianying')
}
</script>

<style lang="scss" scoped>
ul{
    padding: 15px;
    display: flex;
    justify-content: space-between;
    li{
        p{
            margin-top: 5px;
            font-size: 16px;
            text-align: center;
        }
    }
}
</style>